import {useEffect, useState} from "react";

//模拟一个接口请求函数
async function queryData(){
  const data = await new Promise((resolve) => {
    setTimeout(() => {
      resolve(666)
    },2000)
  })
  return data
  }

function App(){
  let [num,setNum] = useState(1)//[1,函数体]
  const [age,setAge] = useState(18)

  // useEffect(()=>{
  //   queryData().then(data => {
  //     setNum(data)
  //   })
  // },[1])

  useEffect (
    ()=>{
      console.log('useEffect')
      let timer = setInterval(()=>{
        console.log(num)
      },1000)

      return ()=>{
        console.log('清除定时器,组件卸载')
        clearInterval(timer)
      }
    },[num])

  // let [num,setNum] = useState(()=>{
  //   const a =1
  //   const b =2
  //   return a+b
  // })

  function handle(){
    //num++ //num 改了但是无法触发试图更新
    setNum(num+1)//将num修改为参数值，并触发视图更新
    console.log(num); 
  }

  return(
    <div>
      <button onClick={handle}>{num}</button>
      <h2 onClick={() => setAge(age + 1)}>{age}</h2>
    </div>
  )
}
export default App;